<template>
    <div class="app" :style="styleDiv">
    	<img src="../assets/images/applogo.png" alt="">
    	<h2>打零工</h2>
    	<span>2.6.8</span>
    	<div class="content">
    		<div>打零工是为了让弹性雇佣信息更加公<br/>开透明、规范和便利而存在</div>
    		<p>专门解决雇主弹性雇佣和雇员弹性工作需求<br/>的移动应用，目标群体涵盖<br/>蓝领工人、灰领工人，零时工、钟点工、兼职，<br/>甚至包括有弹性工作需求的<br/>白领和金领</p>
    		<h1>我们更专注于零工交易</h1>
    	</div>
    	<div class="link clearfix">
        <div><span><i class="iconfont icon-ios"></i>IPhone下载</span></div>
        <div><span><i class="iconfont icon-android"></i>Andriod下载</span></div>
    	</div>
    </div>
</template>

<script>
export default {
    name: 'app',
    data(){
    	return{
    		styleDiv:{ width: '100', height: '100%'},
    	}
    },
    methods:{
    	bgsize(){
    		let pageWidth = window.innerWidth;
    		let pageHeight = window.innerHeight;
    		this.styleDiv.width = pageWidth+"px";
    		this.styleDiv.height = pageHeight+"px";
    	}
    },
    mounted(){
    	this.bgsize()
    	var _this = this;
    	window.onresize = function(){
    		_this.bgsize()
    	};

    },
}
</script>

<style scoped>
.app{
	font-size: 14px;
	font-weight: normal;
	text-align: center;
	background: url(../assets/images/appintrobg.png) 0 0 no-repeat;
	background-size: 100% 100%;
	position: relative;
	padding-top: 40px;
	box-sizing: border-box;
}
.app img{
	width: 70px;
	height: 70px;
	display: block;
	margin: 0 auto;
}
h2{
	font-size: 16px;
	color: #67430A;
	line-height: 24px;
	font-weight: normal;
}
span{
	font-size: 12px;
}
.content{
	width: 100%;
	line-height: 20px;
	position: absolute;
	left: 0;
	top:35%;
}
.content{
	color: #656565;
}
.content div{
	color: #67430A;
	margin-bottom: 24px;
}
.content h1{
	font-size: 14px;
	font-weight: normal;
	margin-top: 24px;
}
.link{
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 30px;
}
.link div{
	width: 50%;
	float: left;
}
.link div span{
	width: 80%;
	height: 40px;
	line-height: 40px;
	color: #fff;
	text-align: center;
	border:1px solid #fff;
	border-radius: 10px;
	margin: 0 auto;
	display: block;
}
</style>
